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What  are  Rich  Internet  Applications? 


■  "Next-generation  Web  applications  that 
combine  the  benefits  of  desktop  software  with 
the  reach  of  the  Web  to  create  more  engaging 
user  experiences."  -  Adobe,  2006 
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What  are  Rich  Internet  Applications? 


■  Beyond  basic  HTML 

■  Ul  controls  and  components  written  in  JavaScript 

■  Integration  between  HTML/JS  and  Flash/Flex 

■  New  ways  of  interacting  with  information 

■  Maps 

■  Calendaring 

■  User-user  interaction 
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Demo:  Dreamweaver  and  Spry 


■  Creating  keyboard-accessible  tabbed  navigation 

■  Creating  accessible  live  regions 
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What  is  Flex? 


■  Language  for  creating  Flash  applications 

■  XML-based  syntax 

■  CSS-based  layout 

■  ActionScript-based  behaviors 

■  Open-source  framework 

■  Open  bug  tracking 

■  Flex  3  released  24  February  2008 

■  JAWS  8/9  scripts  for  Flex  3  this  month 
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Flex  Accessibility 


28  Accessible  Flex  Components 

■  Accordion 

■  AdvancedDataGrid 

■  Alert 

■  Button 

■  CheckBox 

■  ColorPicker 

■  ComboBox 

■  DataGrid 

■  DateChooser 

■  DateField 

■  Form 

■  Image 

■  Label 

■  LinkButton 
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■  List 

■  Menu 

■  MenuBar 

■  Panel 

■  RadioButton 

■  RadioButtonGroup 

■  TabNavigator 

■  Text 

■  TextArea 

■  Textlnput 

■  TitleWindow 

■  ToolTipManager 

■  Tree 

■  Validator 
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Flash  Accessibility  panel 


■  Assigning  name,  equivalents,  and 
labels 

■  Auto-labeling  is  enabled  by  default 

■  Enabled  for  an  entire  movie 

■  Assumes  text  contained  within  an 
object  serves  as  the  label 

■  Will  only  use  one  text  object 

■  For  components,  text  above  or  to  the 
left  will  be  read  as  the  label 

■  Assigning  a  .  name  property  value 
overides  auto-label  feature 
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Provide  Equivalents  and  Names 


.accProps.silent 


.accProps.forceSimple 


.accProps.noAutolabeling 


_accProps.name 


_accProps.description 
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ActionScript  2 


▼  Accessibility 

0  Make  Movie  Accessible 
0  Make  child  objects  accessible 
0  Auto  label 

Name: 

Description: 


Provide  Equivalents  and  Names 


accessibilityProperties.silent 


accessibilityProperties.forceSimple 


accessibilityProperties.noAutolabeling 


accessibilityProperties.name 


accessibilityProperties.description 
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ActionScript  3 


▼  Accessibility 

0  Make  Movie  Accessible 
0  Make  child  objects  accessible 
0  Auto  label 

Name: 

Description: 


Provide  Equivalents  and  Names 


accessibilityProperties.silent 

Used  to  make  the  movie  clip  or 
root  movie  inaccessible  to 
assistive  technologies. 
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Provide  Equivalents  and  Names 


accessibilityProperties.forceSimple  _ _ 

Used  to  hide  all  child  objects  for  a 
object,  resulting  in  a  single  accessible 
object. 
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Provide  Equivalents  and  Names 


accessibilityProperties.noAutolabeling - 

Used  to  toggle  the  Flash  player's  ability 
to  assign  accessibility  names 
automatically.  If  this  property  is 
disabled,  developers  need  to  assign 
names  for  all  objects. 

Only  defined  at  the  root  movie  level. 
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Provide  Equivalents  and  Names 


■  Labels  can  be  assigned  using  the 
.  name  property. 

■  There  are  two  ways  of  assigning  the 
.  name  property. 

■  First,  you  can  use  the  Accessibility 
panel. 

■  Keep  values  descriptive  of  function, 
not  the  control  itself 
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Provide  Structure,  Role,  and  State  Information 


■  Screen  reader  user  should  know 
what  every  control  does 

■  Buttons  must  be  correctly  identified 

■  Controls  emulating  standard  windows 
controls  should  be  identified 
appropriately 

■  Unusual  controls  should  provide  cues  to 
users  as  to  their  identification,  operation 
and  state  information 

■  Flash  CS3's  Ul  components  handle  role 
for  you. 


Learn  more 


NEWPORT  UNLIMITED 


WELCOME 

OBJECTIVES 


NEWS  &  EVENTS 
OVERVIEW 


M* 


THE  TEAM 


NEWPORT  URC 


BOARD  MEMBERS  TE/ 


5.  A  person  who  trains  or  1 

directs  a  player  or  team  | 

8.  A  football  game  played 

each  year  to  determine  the 
championship  of  the  _ 

National  Football  League  ^ 

Down 

player  who  has  the  ball  to 
the  ground 

4.  To  throw  the  ball  to  another 

player 


When  the  players  on  the 
field  from  one  team  form  a 
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Provide  Structure,  Role,  and  State  Information 


■  Every  control  should  indicate  state: 

■  Current  selection. 

■  Number  of  possible  selections. 

■  Update  when  selection  changes. 

■  Flash  CS3's  Ul  components  handle 
state  for  you. 
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Provide  Equivalents  and  Names  (AS2) 


■  Labels  can  be  assigned  using  ActionScript 

■  Three  step  process 

■  Create  accessibility  object  for  each  instance  (once) 

■  Assign  properties 

■  Update  accessibility  object  (once  per  event) 


_root . city4_mc ._accprops  =  new  Object  (); 
_root . city4_mc ._accprops . name  =  "Home"; 
Accessibility . updateProperties ()  ; 
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Provide  Equivalents  and  Names  (AS3) 


■  Changes  in  ActionScript  3  affect  how  accessibility  names  are 
defined 


this . city4_mc . accessibilityPropert ies  =  new  AccessibilityProperties ( ) ; 
this . city4_mc . accessibilityPropert ies . name  =  "Home"; 

Accessibility . updatePropert ies () ; 
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Controlling  Tab  and  Reading  Order 


How  do  we  ensure  that  the  content 
reads  in  the  correct  order? 
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Controlling  Tab  and  Reading  Order 


Ensure  objects  are  read  in  a  sensible  order 

■  The  tab  order  for  a  Flash  or  Flex  application  is  used  to  determine  the  order  of 
the  items  in  the  MSAA  tree,  which  is  used  for  the  reading  order 

■  The  MSAA  tree  is  used  in  the  same  way  that  JAWS  uses  the  DOM  for  HTML  reading  order. 

■  Use  MSAA  inspector  tools  and  a  screen  reader  to: 

■  ensure  labels  are  read  before  controls 

■  ensure  any  instructions  for  controls  are  read  before 
controls  themselves 
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Controlling  Tab  and  Reading  Order 


Controlling  reading  order  is  different  than  controlling  what  the  user  reads 

■  Flash  allows  the  focus  to  be  programmatically  moved,  screen  readers  will 
respond  to  this  in  "forms"  mode  only. 

■  Screen  readers  maintain  an  off-screen  model  which  is  followed  instead  of 
the  system  focus,  except  in  forms  mode. 
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Captions  and  Subtitles 


■  Flash  CS3  enables  easy-to-implement  captioning  support 

■  FLVPIaybackCaptioning  component 

■  Support  for  W3C's  DFXP  Tinned  Text  format  built  in. 

■  Includes  support  for  captioning  full  screen  video. 

■  Captioning  session  on  Friday 
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Provide  Structure,  Role,  and  State  Information 


Enabling  Flash  components 

■  Button 

import  f 1 . accessibility. ButtonAccImpl ; 
ButtonAccImpl . enableAccessibility ( )  ; 

■  Check  Box 

import  f 1 . accessibility. CheckBoxAccImpl ; 
CheckBoxAccImpl . enableAccessibility ( ) ; 

■  Radio  Button 

import  f 1 . accessibility. RadioButtonAccImpl ; 
RadioButtonAccImpl . enableAccessibility ( ) ; 


■  Combo  Box 

import  f 1 . accessibility. ComboBoxAccImpl ; 
ComboBoxAccImpl . enableAccessibility ( ) ; 

■  List 

import  f 1 . accessibility. ListAccImpl; 
ListAccImpl . enableAccessibility ( )  ; 


■  Tile  List 

import  f 1 . accessibility. TileListAccImpl; 
TileList . enableAccessibility ( )  ; 
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Demo:  Flash  accessibility 
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Thanks! 


■  http://adobe.com/accessibility/ 

■  http://blogs.adobe.com/accessibility/ 

J 
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Revolutionizing 

how  the  world  engages 
with  ideas  and  information 
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